<script setup lang="ts">
const router = useRouter()
const columns: Array<any> = [
  { title: '受理号', key: 'ywh' },
  { title: '业务类型', key: 'typebCode' },
  { title: '申请人', key: 'proposerName' },
  { title: 'zl', key: 'zl' },
  { title: '受理时间', key: 'slsj' },
  { title: '承诺时间', key: 'shouldFinishTime' },
  { title: '当前节点', key: 'convertWorkflowNode' },
  { title: '到达当前节点时间', key: 'receivingTime' },
  { title: '剩余[天]', key: 'laveDay', width: 80 }
]

const list = [
  {
    title: '国有建设用地首次登记',
    ywh: '20236815035607',
    transactionId: '111111111111111',
    path: 'house/11010101',
    typebCode: '11010101',
    proposerName: '陈科',
    zl: '翔安区西炉南三里2号2604室',
    slsj: '2023-12-08 14:49:28',
    shouldFinishTime: '2024-01-12 09:29:00',
    convertWorkflowNode: '0101',
    receivingTime: '2023-12-08 14:49:35',
    laveDay: 2,
    showDelete: true
  },
  {
    title: '国有建设用地首次登记',
    ywh: '20236815035607',
    transactionId: '222222222222222',
    path: 'house/11010101',
    typebCode: '11010101',
    proposerName: '陈科',
    zl: '翔安区西炉南三里2号2604室',
    slsj: '2023-12-08 14:49:28',
    shouldFinishTime: '2024-01-12 09:29:00',
    convertWorkflowNode: '0101',
    receivingTime: '2023-12-08 14:49:35',
    laveDay: 2
  },
  {
    title: '国有建设用地首次登记',
    ywh: '20236815035608',
    transactionId: '333333333333333',
    path: 'house/11010101',
    typebCode: '11010101',
    proposerName: '陈科',
    zl: '翔安区西炉南三里2号2604室',
    slsj: '2023-12-08 14:49:28',
    shouldFinishTime: '2024-01-12 09:29:00',
    convertWorkflowNode: '0101',
    receivingTime: '2023-12-08 14:49:35',
    laveDay: 2
  }
]

const onDelete = (row) => {
  alert('删除案件')
  const { ywh } = row
}

const onClick = ({ title, typebCode, transactionId }) => {
  router.push({ name: 'transaction', params: { title, typebCode, transactionId } })
}
</script>

<template>
  <div>
    <el-table @row-dblclick="onClick" :data="list" style="width: 100%">
      <el-table-column
        v-for="column in columns"
        :key="column.prop"
        :prop="column.key"
        :label="column.title"
        :width="column.width"
        :formatter="column.formatter"
      >
        <template v-if="column.render" #default="{ row, column }">
          <span v-html="column.render(row, column)"></span>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template v-slot="{ row }">
          <el-button v-if="row.showDelete" :key="1" size="small" @click.stop="onDelete(row)"> 删除 </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<style scoped></style>
